<!DOCTYPE HTML>
<html>
<head>
<meta charset="utf-8">
<title>无标题文档</title>
<style>
#div1 {width:600px; height:20px; background:#CCC; position:relative; margin:10px auto;}
#div2 {width:80px; height:20px; background:red; position:absolute; left:0; top:0;}
#div3 {width:600px; height:400px; border:1px solid black; position:relative; overflow:hidden;}
#div4 {position:absolute; left:0; top:0;}
</style>

</head>

<body>
<div id="div1">
	<div id="div2"></div>
</div>
<div id="div3">
	<div id="div4">
	  <div>
	    <div>
	      <div>
	        <h3>智能社是一家专注于web前端开发技术的专业培训机构，现推出&ldquo;HTML5&rdquo;、&ldquo;JavaScript&rdquo;和&ldquo;HTML+CSS&rdquo;三套课程</h3>
          </div>
	      <p><a href="javascript:;">登录</a>   <a href="javascript:;">关注我们</a></p>
        </div>
      </div>
	  <div></div>
	  <div>
	    <div><a href="http://www.zhinengshe.com/"><img src="http://localhost/project/zns/images/logo.png" alt="智能社——前端培训专家"></a></div>
	    <div>
	      <div></div>
	      <a href="http://localhost/project/zns/index.html">首 页</a> <a href="http://localhost/project/zns/js02_desc.html">JS课程</a> <a href="http://localhost/project/zns/html5_01_desc.html">HTML5课程</a> <a href="http://localhost/project/zns/video.html">视频教程</a> <a href="http://localhost/project/zns/works.html">课程案例</a> <a href="http://localhost/project/zns/contact.html">联系方式</a></div>
      </div>
	  <div id="zns_zt_content">
	    <div>
	      <p>  <a href="http://localhost/project/zns/index.html">首页</a>&gt;<a href="http://localhost/project/zns/train_list.html">培训课程</a>&gt;<em>精通JavaScript开发</em></p>
	      <div></div>
	      <p><a href="http://localhost/project/zns/train_list.html">&gt; 返回</a></p>
        </div>
	    <div>
	      <div>
	        <div>
	          <ul>
	            <li href="0#180"><a href="javascript:;">课程介绍</a></li>
	            <li href="1#180"><a href="javascript:;">课程详情</a></li>
	            <li href="2#180"><a href="javascript:;">课程大纲</a></li>
	            <li href="0#3550"><a href="javascript:;">常见问题</a></li>
              </ul>
	          <div></div>
	          <div>
	            <div>
	              <div>
	                <div></div>
	                <a href="http://wpa.qq.com/msgrd?v=3&uin=1839006349&site=qq&menu=yes" id="zns_free" target="_blank">申请免费试听</a><a href="http://wpa.qq.com/msgrd?v=3&uin=1839006349&site=qq&menu=yes" id="zns_rc" target="_blank">我要咨询报名</a></div>
                </div>
              </div>
	          <div>
	            <div>
	              <div><a href="http://localhost/project/zns/html5_01_desc.html" target="_blank">HTML5+CSS3课程</a><a href="http://localhost/project/zns/css01_desc.html" target="_blank">精通XHTML+CSS课程</a></div>
                </div>
              </div>
	          <div></div>
            </div>
	        <div>
	          <div>
	            <div>
	              <div></div>
                </div>
              </div>
	          <div>
	            <div>
	              <div>
	                <h2>精通JavaScript开发 — 课程介绍</h2>
	                <p>本课程适合想成为专业前端工程师的你，我们做的是培养专家.^_^</p>
	                <div></div>
	                <div>
	                  <h3>近期学员就业——学完拿高薪，才是好课程</h3>
                    </div>
	                <div></div>
	                <div>
	                  <dl>
	                    <dt><a href="javascript:;"><img src="http://localhost/project/zns/images/studentImg/student_steven.jpg"></a><a href="javascript:;">课程：JavaScript高级课程</a></dt>
	                    <dd>
	                      <p><em>姓名：</em></p>
	                      <p>所学课程：JS高级</p>
	                      <p>学前工作：2年左右</p>
	                      <p>学前月薪：6-7K</p>
	                      <p>就职公司：新*传媒</p>
	                      <p>就职月薪：10-13K</p>
                        </dd>
                      </dl>
	                  <dl>
	                    <dt><a href="javascript:;"><img src="http://localhost/project/zns/images/studentImg/student_syq.jpg"></a><a href="javascript:;">课程：JavaScript高级课程</a></dt>
	                    <dd>
	                      <p><em>姓名：</em></p>
	                      <p>所学课程：JS高级</p>
	                      <p>学前工作：学生</p>
	                      <p>学前月薪：无</p>
	                      <p>就职公司：*友科技</p>
	                      <p>就职月薪：6-8K</p>
                        </dd>
                      </dl>
	                  <dl>
	                    <dt><a href="javascript:;"><img src="http://localhost/project/zns/images/studentImg/student_zxr.jpg"></a><a href="javascript:;">课程：JavaScript高级课程</a></dt>
	                    <dd>
	                      <p><em>姓名：</em></p>
	                      <p>所学课程：JS高级</p>
	                      <p>学前工作：半年左右</p>
	                      <p>学前月薪：1-3K</p>
	                      <p>就职公司：*优势科技</p>
	                      <p>就职月薪：5-7K</p>
                        </dd>
                      </dl>
	                  <dl>
	                    <dt><a href="javascript:;"><img src="http://localhost/project/zns/images/studentImg/student_fxy.jpg"></a><a href="javascript:;">课程：JavaScript高级课程</a></dt>
	                    <dd>
	                      <p><em>姓名：</em></p>
	                      <p>所学课程：JS高级</p>
	                      <p>学前工作：5年左右</p>
	                      <p>学前月薪：2-4K</p>
	                      <p>就职公司：闪*网</p>
	                      <p>就职月薪：7-9K</p>
                        </dd>
                      </dl>
                    </div>
	                <div></div>
	                <div><img src="http://localhost/project/zns/images/7_9.png" alt=""></div>
	                <div></div>
	                <div>
	                  <h3>凭什么智能社的学员能拿高薪</h3>
                    </div>
	                <div></div>
	                <div><em>1</em>
	                  <h3><strong>课程</strong>- 为就业而生</h3>
	                  <p>-谁出来学习，也不是为了玩，所以智能社的课程就是为了就业而生的，课程内容完全以公司用人要求为最低标准，智能社教的就是你在工作中用的东西。<br>
	                    <br>
	                    -课程进化从未停止，每一天，我们都在根据公司和学员反馈信息，不断调整课程，确保大家学到的永远是最新、最实用的东西。<br>
	                    <br>
	                    -课程体系全面而系统，涵盖从基础知识到大型应用的各类知识，让你从容应对工作中出现的各类JS问题。<br>
	                    <br>
	                    <a href="javascript:;" onclick="var obj=getEle('.newKcNavLeft li')[2]; if(obj)obj.onclick();">&gt;&gt;查看2.0课程大纲</a></p>
                    </div>
	                <div>如果你想学完找份高薪的工作，那智能社的JavaScript高级课程正是你需要的</div>
	                <div><em>2</em>
	                  <h3><strong>深度</strong>- 北京最专业的JS培训课程</h3>
	                  <p>-智能社的JS课程——由前淘宝核心开发工程师Blue倾力打造，将其近10年程序经验、领悟投入到本课程上——只求将一线宝贵工作经验传授给学员，打造国内一流的JS培训课程。<br>
	                    <br>
	                    -课程内容够深入，直接深入核心，剖析本质，绝非点到即止——如果课程内容浅，学员学着轻松，可到了公司依然什么都不会——这，可不是智能社的作风。<br>
	                    <br>
	                    -课程内容量大大超出公司用人标准——如果公司对人的要求是10分，那智能社就教到20分，这才是智能社的风格。<br>
	                    <br>
	                    -你需要的东西，都在智能社的课程里：<strong>后台交互、模块化、程序思想、JS优化与调试、大型项目实例，还有更多......</strong><br>
	                    <br>
	                    <br>
	                    <a href="javascript:;" onclick="var obj=getEle('.newKcNavLeft li')[2]; if(obj)obj.onclick();">&gt;&gt;查看2.0课程大纲</a></p>
                    </div>
	                <div>如果你发现居然有比智能社更专业、更具深度的JS课程，请立刻与我们联系，必有重谢 ^_^</div>
	                <div><em>3</em>
	                  <h3><strong>讲师</strong>- 智能社金牌JS讲师Blue亲自主讲</h3>
	                  <p>-公认最好的JavaScript视频教程，此视频成为JS爱好者必备的最佳JS入门学习视频，如果你还没有看过，机会来了 :) <a href="http://localhost/project/zns/video.html" target="_blank">&gt;&gt;点击进入视频列表</a><br>
	                    <br>
	                    -公认最好的JavaScript讲师，课程讲解通俗易懂，开放而兼具互动，堪称JS最佳学习体验之旅，想来试试吗 <a href="http://wpa.qq.com/msgrd?v=3&uin=1839006349&site=qq&menu=yes" target="_blank">&gt;&gt;点击报名免费试听</a> <strong>注意！是免费的哦</strong><br>
	                    <br>
	                    -我就是Blue，我在智能社——前淘宝核心开发工程师，先后亲历多次大型项目开发，涉足前端交互、用户体验、数据挖掘等多个领域，具备极其深厚的程序功底，拥有近10年程序开发经验，喜好钻研技术问题，离开淘宝后转战教育事业，现成立智能社，力求传播先进技术，解决人才鸿沟，为JS培训行业做些贡献<br>
	                    <br>
                      </p>
                    </div>
	                <div>来智能社享受一流的课程体验</div>
	                <div><em>4</em>
	                  <h3><strong>思想</strong>- 你想成为JS高手吗，方法在这里</h3>
	                  <p>-是否觉得写程序时不知如何入手？对于一个问题觉得明白了，但一写东西就不知道怎么办了？是否想要成为JS高手，又不知如何做到？这些问题，其实都是缺少程序思想。<br>
	                    <br>
	                    -思想是关键，真正的高手，遇到任何问题都知道如何解决；真正的高手，在写出代码之前，程序的大体结构已经心中有数，绝非写一点想一点；能够做到这些，都因为思想，当然，这种东西也有别的叫法——&ldquo;思路&rdquo;、&ldquo;算法&rdquo;、&ldquo;经验&rdquo;、&ldquo;方法&rdquo;......<br>
	                    <br>
	                    -思想这东西书本上没有，书本里只有一个个函数，一个个知识点。这些思想全部来源于实际工作中遇到的问题，被智能社的讲师提炼出来，贯穿于整个课程之中，让大家快速吸收，高速成长。<br>
	                    <br>
	                    -智能社的JS课程，在讲解知识的同时，还会帮助大家掌握思考问题的方法，这才是重点，让大家真正明白问题是要怎么去思考，如何去解决的。<br>
                      </p>
                    </div>
	                <div>思想决定水平高低，在智能社，提升自己</div>
	                <div><em>5</em>
	                  <h3><strong>实战</strong>- 从 上课听懂 到 彻底掌握</h3>
	                  <p>-就算是个练武奇才，各种骨骼惊奇，给他几本武林宝典，看个三年，但是完全不动手练习，估计下山就被几个山贼放倒了，而学习JS也是一个道理，没有什么比练习更能帮助大家提高了。<br>
	                    <br>
	                    -智能社帮你准备了大量实战练习，从最基础的知识点练习开始，逐步提升，此外智能社还精选了多个来自公司的真实项目（涉及到公司内部细节的部分有修改），帮助大家真正掌握JS，而非纸上谈兵。<br>
	                    <br>
	                    -单个的小东西学过几天都会做，但是真正在项目里写东西，又是另一种情况了，智能社准备的每个实战项目，都有不同的侧重，有的重点训练大家的后台交互，有的重点练习代码整合和重用，帮你完全打通JS的每个环节。<br>
	                    <br>
                      </p>
                    </div>
	                <div>来智能社，学真东西</div>
	                <div></div>
	                <div>
	                  <h3>常见问题</h3>
                    </div>
	                <div>
	                  <div></div>
	                  <div>
	                    <div>
	                      <h3>零基础是否能学会</h3>
	                      <p>可以，零基础的学员，也可以顺利掌握智能社的JavaScript课程内容。</p>
	                      <p>到目前为止，已经毕业的几百名学员中，大部分都是零基础（应届生或转行前端）的朋友，所以智能社有信心让没有基础的朋友也能掌握课程知识。</p>
	                      <p>当然，有其他程序经验的朋友，学习起来确实会轻松顺畅一些，这也是客观规律。不过智能社相信，只要你肯努力，勤思考、多做练习，没有基础也能掌握JS，只是需要付出更多努力罢了。</p>
	                      <p>另外，在你开始学习JS之前，需要先具备HTML/CSS方面的知识，如果是目前没有此基础，可先从HTML/CSS开始学起，然后再进行JS课程的学习。</p>
                        </div>
	                    <div>
	                      <h3>可以分期付款吗</h3>
	                      <p>可以，智能社一直坚信&ldquo;学习，是一种投资&rdquo;，能够分期买房买车，学习为什么不行 ^_^</p>
	                      <p>至于具体的分期付款方式，我们也在随时调整，所以请直接<a href="http://localhost/project/zns/contact.html">&gt;&gt;与我们联系</a>，了解详情</p>
                        </div>
	                    <div>
	                      <h3>上课时间、需要多久学完</h3>
	                      <p>要看选择哪种班型了，智能社的上课时间分为周末班和全日制班两种。</p>
	                      <p>周末班适合在上班的朋友，没法辞职全天来学习；</p>
	                      <p>全日制班适合想要用一段时间，专心学习，全天上课的朋友。</p>
	                      <p>这两种班型的时间分别是：</p>
	                      <p>全日制班　　周一~周五上课，学完大约需要3个月左右</p>
	                      <p>周末班　　　周六、周日上课，学完大约需要5-6个月左右</p>
	                      <p>这两种班型，上课内容完全一样，只是上课时间不同，大家可根据自己的需求，自由选择。</p>
                        </div>
	                    <div>
	                      <h3>学完包就业吗</h3>
	                      <p>不需要包就业，智能社的学员毕业从来不愁就业，倒是有很多公司找智能社要人，一般都要不到，因为大家毕业就都找到好工作了。</p>
	                      <p>如果哪个培训机构的学员，毕业后连工作都找不到，那这个机构实在太失败了。</p>
	                      <p>当然，因为智能社毕业的学员很多都在国内一流互联网公司任职，所以如果需要，我们也会帮忙推荐，既是帮助学员找到更好的工作，也是帮助完成老学员招聘工作。</p>
                        </div>
                      </div>
	                  <div>
	                    <h3>我要提问</h3>
	                    <p>智能社乐于倾听，如有问题，欢迎与我们联系</p>
                      </div>
                    </div>
                  </div>
                </div>
              </div>
	          <div>
	            <div>
	              <div></div>
                </div>
              </div>
            </div>
          </div>
	      <div></div>
        </div>
	    <div></div>
      </div>
	  <div>
	    <p><a href="http://localhost/project/zns/js02_desc.html">JavaScript课程</a> <a href="http://localhost/project/zns/html5_01_desc.html">HTML5课程</a> <a href="http://localhost/project/zns/css01_desc.html">HTML+CSS课程</a> <a href="http://localhost/project/zns/video.html">视频教程</a> <a href="http://localhost/project/zns/works.html">课程案例</a> <a href="http://localhost/project/zns/contact.html">联系方式</a> <a href="javascript:;">版权所有</a> <a href="javascript:;">京ICP备12022017号-1</a></p>
      </div>
	  <div id="qqOnline">
	    <div>
	      <p>1030939631</p>
	      <p><a target="_blank" href="http://wpa.qq.com/msgrd?v=3&uin=1030939631&site=qq&menu=yes"><img src="http://wpa.qq.com/pa?p=2:1030939631:41" alt="" title="点击这里给我发消息"></a></p>
	      <div></div>
	      <p>1839006349</p>
	      <p><a target="_blank" href="http://wpa.qq.com/msgrd?v=3&uin=1839006349&site=qq&menu=yes"><img src="http://wpa.qq.com/pa?p=2:1839006349:41" alt="" title="点击这里给我发消息"></a></p>
        </div>
      </div>
	  <div><img src="http://www.zhinengshe.com/images/fast_nav.png" alt=""></div>
	  <br>
	</div>
</div>
<script type="text/javascript">
	//0 - 50% -  100%
	//0 -1911-  3822
	div2.onmousedown = function(e){
		var ev = e || event;
		var l = ev.clientX - this.offsetLeft;
		document.onmousemove = function(e){
			var ev = e || event;
			var needL = ev.clientX - l;
			var maxL = div1.offsetWidth - div2.offsetWidth;
			var maxT = div4.offsetHeight - div3.offsetHeight;
			div4.style.top = -maxT * (div2.offsetLeft/maxL) + 'px';
			//console.log(div2.offsetLeft/maxL)
			needL = needL<0?0:needL;
			needL = needL>maxL?maxL:needL;
			div2.style.left = needL +'px';

		};
		document.onmouseup = function(){
			document.onmousemove = document.onmouseup = null;
		};
		return false;
	}

</script>
</body>
</html>











